<!DOCTYPE html>
<html>
<head>
<title>会议室预约系统</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/layui/css/layui.css">
<link rel="stylesheet" href="/css/global.css">
</head>
<body>


	<div class="fly-header layui-bg-black">
		<div class="layui-container">
			<a href="/">会议室预约系统</a>

			<ul class="layui-nav fly-nav-user">
				<!-- 登入后的状态 -->
				<li class="layui-nav-item"><a class="fly-nav-avatar" href="javascript:;"> <cite class="layui-hide-xs" id="nav_nickname" th:text="${nickname}"></cite>
				</a>
					<dl class="layui-nav-child">
						<dd>
							<a href="/logout" style="text-align: center;">退出</a>
						</dd>
					</dl></li>
			</ul>
		</div>
	</div>


	<div class="layui-container fly-marginTop">

		<div class="fly-panel-user">
			<div class="layui-tab layui-tab-brief" lay-filter="user">
				<ul class="layui-tab-title" id="LAY_mine">
					<li class="layui-this" lay-id="info">会议室</li>
					<li lay-id="pass">修改密码</li>
				</ul>
				<div class="layui-tab-content" style="padding: 20px 0;">
					<div class="layui-form layui-form-pane layui-tab-item layui-show">
						<div class="layui-form-item">
							<div class="layui-input-inline">
								<button class="layui-btn" lay-filter="room1" lay-submit>一号会议室</button>
							</div>
						</div>
						<div class="layui-form-item">
							<div class="layui-input-inline">
								<button class="layui-btn" lay-filter="room2" lay-submit>二号会议室</button>
							</div>
						</div>
						<div class="layui-form-item">
							<div class="layui-input-inline">
								<button class="layui-btn" lay-filter="room3" lay-submit>三号会议室</button>
							</div>
						</div>
					</div>

					<div class="layui-form layui-form-pane layui-tab-item">
						<div class="layui-form-item">
							<label for="L_user_password" class="layui-form-label">当前密码</label>
							<div class="layui-input-inline">
								<input type="password" id="L_user_password" name="userPassword" required lay-verify="required" autocomplete="off" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item">
							<label for="L_pass" class="layui-form-label">新密码</label>
							<div class="layui-input-inline">
								<input type="password" id="L_pass" name="newPassword" required lay-verify="required" autocomplete="off" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item">
							<label for="L_repass" class="layui-form-label">确认密码</label>
							<div class="layui-input-inline">
								<input type="password" id="L_repass" name="repass" required lay-verify="required" autocomplete="off" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item">
							<button class="layui-btn" key="set-mine" lay-filter="password" lay-submit>确认修改</button>
						</div>
					</div>
				</div>

			</div>
		</div>
	</div>

	<script src="/layui/layui.js"></script>
	<script>
		layui.use([ 'form', 'element', 'upload'], function() {
			var element = layui.element;
			var form = layui.form;
			var $ = layui.$;
			var upload = layui.upload;
			form.on('submit(room1)', function(data) {
				layer.open({
					type: 2,
					anim: 0,
					skin: 'layui-layer-lan',
					title: '一号会议室',
					fix: false,
					shadeClose: true,
					area: ['1000px', '600px'],
					content: '/room?roomId=room1',
					cancel: function(index, layero){
						layer.close(index);
						return false;
					}
				});
				return false;
			});
			form.on('submit(room2)', function(data) {
				console.log(data.field.roomid);
				return false;
			});
			form.on('submit(room3)', function(data) {
				console.log(data.field.roomid);
				return false;
			});
			form.on('submit(password)', function(data) {
				if (data.field.repass != data.field.newPassword) {
					layer.msg('两次密码不一致', function(){
						
					});
					return false;
				}
				delete data.field.repass;
				$.ajax({
					type : "post",
					url : '/user/password',
					data : data.field,
					async : false,
					cache : false,
					success : function(result) {
						layer.msg(result.message);
					}
				});
				return false;
			});
		});
	</script>

</body>
</html>